画像を軽量化して表示速度をアップ『EWWW Image Optimizer』の設定方法と使い方(追記)
画像のデータ容量が大きいと、読み込むのに時間がかかるので当然遅くなってしまいますよね。サイトの表示速度を速くする方法の一つに、貼り付けてある画像の容量を小さくする方法があります。
通常、画像のサイズを変えずにデータ容量を小さくすると、画質は劣化します。逆に画質を劣化させずにデータ容量を小さくすると、サイズが小さくなくなります。
『EWWW Image Optimizer』の優れているところは、
・画像サイズを変えずにデータ容量を圧縮する
・すでにサーバーにアップロードして公開済みの画像も圧縮処理できる
・個人情報の流出に繋がるExif情報などのメタデータを削除できる
という点です。
導入をしておくべきプラグインの一つです。
追記
EWWW Image Optimizerをインストールしているとpng形式で保存した縦長の画像ファイルがアップロードできないことが判明しました。バグなのかプラグインがファイル容量を圧縮する過程で最善と判断しているのかは不明ですがpng形式がjpg形式になってしまいます。
対処方法を追記します。
目次
1 EWWW Image Optimizerのインストール
1-1 基本設定
1-2 高度な設定
1-3 変換設定
1-4 WebP設定
2 EWWW Image Optimizerの使い方
1 EWWW Image Optimizerのインストール
ダッシュボード > プラグイン > 新規追加 をクリックして、画面右上の検索欄で『EWWW Image Optimizer』と入力してプラグインを検索して、「今すぐインストール」をクリックします。
インストールが完了したら、「有効化」をクリックします。
有効化が成功すると、「プラグインを有効化しました。」とコメントバーが表示されます。
併せて、「使用情報トラッキングを許可しますか?」と表示されます。
許可するか否かは自由ですが、よく分からない場合は「許可しない」を選びましょう。なお、後からでも「許可する」に変えることができます。
基本設定
確認する場所は1か所だけです。
「メタデータを削除」にチェックが入っているかを確認します。
メタデータとは、画像に保存される詳細情報でカメラの型式、撮影時のカメラ設定、GPS情報、カラー情報、サムネイルなどのことを示します。
写真の内容によっては、GPS情報やサムネイルはそのまま個人情報の流出に繋がりますので取扱いに注意が必要です。
高度な設定
高度な設定も確認する場所は1か所だけです。
「無効にする pugout」にチェックが入っているかを確認します。
より高度な圧縮処理を求める場合は、「pngout」をインストールして使用することができますが、普通にサイト作成する程度ならデフォルトのままでも全く問題ありません。
「使用情報トラックングに許可する」場合は、最下段のチェックを使用状況を許可するにチェックを付けて、「変更を保存」をクリックします。
変換設定
変換設定も確認する場所は1か所だけです。
「コンバージョンリンクを非表示」にチェックが入っているかを確認します。
イメージの変換は、データベース内の他の場所からイメージへの参照が行われます。誤って画像を変換しないようにするには、メディアライブラリに表示されるワンクリック変換リンクを無効にします。
「変更を保存」をクリックします。
WebP設定
どの項目にもチェックは不要です(デフォルトのまま)。
WebPとは、Googleが推奨する画像形式ですが、採用しているブラウザーがChrome、Opera、Adroidのみであるため、現時点においては使用しない方が無難でしょう。
2 EWWW Image Optimizerの使い方
ダッシュボード > メディア > 一括最適化をクリックします。
「最適化されていな画像をスキャンする」をクリックします。
最適化を繰り返すと画像は劣化します。「再最適化を強制」のチェックは外しておきましょう。
最適化を実行するファイル数が表示されます。
「最適化を開始」をクリックします。
最適化が完了するとログが表示されます。
InstantWordPressを使用した環境下ですが、1317ファイルを3分弱で最適化が完了しました。(画像は、すべてPhotoShopでWeb用に変換しているため最適化率は3%未満ですが。)
検索エンジンのタイトルやメタディスクリプションを読んでクリックした訪問者は、サイトが表示されるのに時間がかかると閉じてしまいます。(自分が検索する時を思い出してください。)
スマホによる検索エンジンからの流入が50%以上に達するようになっているため、サイトを表示させるデータ容量の圧縮は避けては通れません。
適切な画像データ容量の管理を心掛けましょう。
3 png形式の縦長画像ファイルがjpg形式になってしまう時の対処方法(追記)
冒頭に追記した通り、EWWW Image Optimizerをインストールしているとpng形式で保存した縦長の画像ファイルがアップロードできないことが判明しました。バグなのかプラグインがファイル容量を圧縮する過程で最善と判断しているのかは不明ですがpng形式がjpg形式になってしまいます。
この症状は、縦長のpng形式の画像をアップロードする場合に発生します。(横長のpng形式の画像は正常にpng形式として保存できます。)
結論から言うと、EWWW Image Optimizerを無効化すれば縦長のpng形式の画像をアップロードできます。詳しくは「png形式の画像ファイルがjpgになってしまう時の対処方法」に書きましたので読んでみて下さい。
Themify以外のテーマでも同様の症状がでるので、EWWW Image Optimizerのバグなのか、ワードプレス5.0から発生するようになったのかわかりません。
縦長のpng形式の画像をアップロードしなければ、画像ファイルの容量を小さくしてくれる優れたプラグインであることは変わらないと思います。
追記は以上です。